<template>
  <ws-wx-privacy id="privacy-popup"></ws-wx-privacy>
  <view class="bg">
    <image src="https://wz.mala.cn/static/img/qzhswap-2023.jpg" class="bgimg" mode="widthFix"></image>
    <!--    <view class="t">-->
    <!--      登录-->
    <!--    </view>-->
    <view class="login">
      <uv-checkbox-group @change="change">
        <uv-checkbox :value="1" :name="1" :checked="checked"></uv-checkbox>
        <view style="display: flex" @click="checkxy">
          阅读并接受群众呼声
          <view class="s" @click="xieyi(1)">用户协议</view>
          和
          <view class="s" @click="xieyi(2)">隐私政策</view>
        </view>
      </uv-checkbox-group>
    </view>
    <view class="login2">
<!--      <button type="primary" shape="circle" size="large" open-type="getPhoneNumber"-->
<!--              @getphonenumber="getPhoneNumber" :disabled="disabled" v-if="!disabled">一键登录-->
<!--      </button>-->
      <button type="primary" shape="circle" size="large" open-type="getPhoneNumber"
              @click="test" :disabled="disabled" v-if="!disabled">一键登录
      </button>
      <button type="primary" shape="circle" size="large" v-if="disabled" @click="loginNoxy">一键登录
      </button>
    </view>
  </view>
  <uv-modal ref="modal" title="用户协议及隐私保护" @confirm="confirm">
    <view class="slot-content">
      为更好地保护您的合法权益，请阅读并同意群众呼声
      <view data-type="xieyi" @click="goxieyi('xieyi')">《用户协议》</view>
      <view data-type="yinsi" @click="goxieyi('yinsi')">《隐私政策》</view>
      <view  @click="goxcxxieyi()">《麻辣社区群众呼声小程序隐私保护指引》</view>
    </view>
    <template v-slot:confirmButton>
      <view style="margin:30rpx;display: flex;width:calc(100% - 90rpx)">
        <button type="primary" open-type="agreePrivacyAuthorization" style="width:calc(50% - 10px)" @click="okM"> 同意
        </button>
        <button type="info" style="width:calc(50% - 10px)" @click="closeM"> 拒绝</button>
      </view>
    </template>
  </uv-modal>
</template>

<script setup lang="ts">
import {ref} from 'vue'
import {wxLogin,wxLoginCode,wxLogin2} from '@/common/user'
import {
  useToken
} from "@/stores/userStores";
const userToken = useToken();

const disabled = ref(true)
const xy = ref(1)
const checked = ref(false)
const confirm = () => {

}
const closeM = () => {
  modal.value.close();
}
const okM = () => {
  modal.value.close();
  disabled.value = false
  checked.value = true;
}
const change = (e) => {
  checked.value = !checked.value
  if (checked.value) {
    disabled.value = false
  } else {
    disabled.value = true
  }
}
const test = () => {
  wxLogin2().then(r=>{
     if(r.code==200){
       userToken.setLogin(r.data)
       //上一页
       uni.navigateBack({})
     }
  })
}
const goxcxxieyi = () => {
  uni.openPrivacyContract({});
}
const xieyi = (type) => {
  if (type == 1) {
    uni.navigateTo({
      url: '/pages/user/webview?src=https://wz.mala.cn/wechatApi.Webview/xieyi'
    })
  } else {
    uni.navigateTo({
      url: '/pages/user/webview?src=https://wz.mala.cn/wechatApi.Webview/yinsi'
    })
  }
}
const goxieyi = (ec) => {
  uni.navigateTo({
    url: '/pages/user/webview?src=https://wz.mala.cn/wechatApi.Webview/' + ec
  })
}
const getPhoneNumber = async(e) => {
  if (e.detail.errMsg == "getPhoneNumber:ok") {

    uni.login({
      success(res) {
        uni.showLoading({
          title: '加载中',
          mask: true,
        })
        var code = res.code
        wxLoginCode({code:code}).then(r=>{
          let post = {
            encryptedData: e.detail.encryptedData,
            iv: e.detail.iv,
            session_key: r.data.session_key
          }
          wxLogin(post).then(r => {
             if(r.data.code==200){
                uni.setStorageSync('userToken', r.data.data)
             }else{
               uni.showToast({
                 title: '登录失败，请重试',
                 icon: 'none'
               })
               uni.hideLoading()
             }
          }).catch(e=>{
            uni.showToast({
              title: '登录失败，请重试',
              icon: 'none'
            })
            uni.hideLoading()
          })
        }).catch( e=>{
          uni.showToast({
            title: '登录失败，请重试',
            icon: 'none'
          })
          uni.hideLoading()
        })
      }
    })
  } else {
    uni.showToast({
      title: '请允许获取手机号',
      icon: 'none'
    })
  }
}
const checkxy = () => {
  checked.value = !checked.value
  if (checked.value) {
    disabled.value = false
  } else {
    disabled.value = true
  }
}
const modal = ref(null)
const loginNoxy = () => {
  modal.value.open();
}
</script>


<style scoped lang="scss">
page {
  background: #fff;
}

.slot-content {
  view {
    color: $baseColor
  }
}

.bg {
  background: #fff;

  .bgimg {
    width: 100%;
  }

  .t {
    margin: 20px 40px;
    margin-bottom: 0px;
    color: #444;
    font-size: 28px
  }

  .login2 {
    padding: 30rpx;
  }

  .login {
    margin-top: 50rpx;
    padding: 10rpx 30rpx;
    display: flex;
    align-items: center;

    .s {
      color: $baseColor;
    }
  }
}

</style>
